{#进一步美化base.html，统一商品分类卡片的尺寸#}
<!-- templates/base.html -->
<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>{{ title or '萨科二手交易平台' }}</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <style>
        .product-img {
            width: 100%;
            height: 200px;
            object-fit: cover;
        }
    </style>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
    <div class="container">
        <a class="navbar-brand" href="/">萨科二手交易平台</a>
        <div class="collapse navbar-collapse">
            <ul class="navbar-nav ms-auto">
                <a class="nav-link" href="{{ url_for('goods.publish') }}">发布物品</a>
                {% if current_user.is_authenticated %}
                    <img src="{{ current_user.avatar or url_for('static',filename='default.jpg') }}" class="rounded-circle" width="30" height="30" alt="avatar">
                    <li class="nav-item"><a class="nav-link" href="/user">用户中心</a></li>

                    <li class="nav-item">
                        <a class="nav-link" href="{{ url_for('notification.index') }}">消息中心</a>
                    </li>

                    <li class="nav-item"><a class="nav-link" href="/logout">退出</a></li>
                {% else %}
                    <li class="nav-item"><a class="nav-link" href="/login">登录</a></li>
                    <li class="nav-item"><a class="nav-link" href="/register">注册</a></li>
                {% endif %}
            </ul>
        </div>
    </div>
</nav>
<div class="container mt-4">
    {% with messages = get_flashed_messages() %}
    {% if messages %}
        <div class="alert alert-info">{{ messages[0] }}</div>
    {% endif %}
    {% endwith %}

    {% block content %}{% endblock %}
</div>

{#增加js，支持Bootstrap的交互功能，比如Tab切换、模态框、下拉菜单等#}
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>